<template>
  <div id="app-container">
    <u-page title="广告测试申请单">
      <el-descriptions class="frominfo" :model="form">
        <el-descriptions-item label="申请人员">{{ form.applicantnickname }}【{{ form.applicantusername }}】</el-descriptions-item>
        <el-descriptions-item label="表单编号">{{ form.code }}</el-descriptions-item>
        <el-descriptions-item label="申请时间">{{ form.applyTime }}</el-descriptions-item>
        <el-descriptions-item label="填表人员">{{ form.preparernickname }}【{{ form.preparerusername }}】</el-descriptions-item>
        <el-descriptions-item label="表单状态">{{ form.statusstr }}</el-descriptions-item>
        <el-descriptions-item label="结束时间">{{ form.endTime }}</el-descriptions-item>
        <!--        <el-descriptions-item label="当前处理人"></el-descriptions-item>-->
      </el-descriptions>
      <el-form ref="contractform" :model="form" :rules="contractform" label-width="110px" label-position="left" size="mini">
        <div class="contractCheckBox">
          <el-form-item label="是否生成合同" prop="ifcontract">
            <el-radio-group v-model="form.ifcontract" :disabled="cansave">
              <el-radio label="是" />
              <el-radio label="否" />
            </el-radio-group>
          </el-form-item>
          <el-form-item label="印章类型" prop="sealtype" :hidden="form.ifcontract==='否'" :rules="{required: form.ifcontract!=='否', message: '请选择用印类型', trigger: 'change' }">
            <el-radio-group v-model="form.sealtype" :disabled="cansave">
              <el-radio label="实物印章" />
              <el-radio label="电子印章" />
            </el-radio-group>
          </el-form-item>
          <el-form-item label="用印顺序" prop="sequence" :hidden="form.ifcontract==='否'" :rules="{required: form.ifcontract!=='否', message: '请选择用印顺序', trigger: 'change' }">
            <el-radio-group v-model="form.sequence" :disabled="cansave">
              <el-radio label="对方先用印" />
              <el-radio label="我方先用印" />
            </el-radio-group>
          </el-form-item>
          <el-form-item label="对方类型" prop="usertype" :hidden="form.ifcontract==='否'" :rules="{required: form.ifcontract!=='否', message: '请选择对方类型', trigger: 'change' }">
            <el-radio-group v-model="form.usertype" :disabled="cansave">
              <el-radio label="个人" />
              <el-radio label="企业" />
            </el-radio-group>
          </el-form-item>
        </div>
        <div class="contractDetailBox">
          <el-row>
            <el-col :span="6">
              <el-form-item label="扣费部门" prop="deptid" style="padding-top: 10px">
                <el-cascader
                  ref="depts"
                  v-model="form.deptid"
                  :options="deptList"
                  :show-all-levels="false"
                  :disabled="cansave"
                  @change="handledeptChanged"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item label="广告类型" prop="adtype">
            <el-radio-group v-model="form.adtype" :disabled="cansave||form.demanddetailsData.length!=0">
              <el-radio label="LED" />
              <el-radio label="灯箱" />
              <el-radio label="橱窗" />
            </el-radio-group>
          </el-form-item>
          <el-form-item label="费用承担方" prop="contracttype">
            <el-select v-model="form.contracttype" placeholder="请选择合同类型" :disabled="cansave" @change="handleContracttypeChanged">
              <el-option v-for="item in contractTypes" :key="item.id" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="付款方式" prop="paytype" :hidden="form.contracttype==='公司承担'">
            <el-radio-group v-model="form.paytype" :disabled="cansave">
              <el-radio label="账扣" :disabled="form.contracttype==='第三方承担'" />
              <!--              <el-radio label="现扣" :disabled="form.contracttype==='第三方承担'" />-->
              <el-radio label="现金缴款" />
            </el-radio-group>
          </el-form-item>
          <el-row :hidden="form.contracttype==='第三方承担'">
            <el-col :span="7" style="padding-top: 8px">
              <el-form-item label="厂商编码" prop="firmcode" :rules="{required: form.contracttype!=='第三方承担', message: '请填写厂商编号', trigger: 'blur' }">
                <el-input v-model="form.firmcode" style="width: 200px" :disabled="cansave" @change="hdlfirmcode" />
              </el-form-item>
            </el-col>
            <el-col :span="8" style="padding-top: 6px;">
              <el-button type="text" @click="handleFCInfos">[厂商编号及合同编号]</el-button>
            </el-col>
          </el-row>
          <el-form-item label="厂商名称" prop="firmname">
            <el-input v-model="form.firmname" style="width: 400px" :disabled="cansave" />
          </el-form-item>
          <el-form-item label="合同号" prop="hth" :rules="{required: form.contracttype==='厂商承担', message: '请填写合同号', trigger: 'blur' }" :hidden="form.contracttype==='第三方承担'">
            <el-input v-model="form.hth" style="width: 400px" :disabled="true" />
          </el-form-item>
          <el-form-item label="专柜编号" prop="zgid" :rules="{required: form.contracttype==='厂商承担', message: '请填写专柜编号', trigger: 'blur' }" :hidden="form.contracttype==='第三方承担'">
            <el-input v-model="form.zgid" style="width: 400px" :disabled="true" />
          </el-form-item>
          <el-form-item label="专柜名称" prop="zgname" :rules="{required: form.contracttype==='厂商承担', message: '请填写专柜名称', trigger: 'blur' }" :hidden="form.contracttype==='第三方承担'">
            <el-input v-model="form.zgname" style="width: 400px" :disabled="true" />
          </el-form-item>
          <el-form-item label="备注" prop="remarks">
            <el-input v-model="form.remarks" type="textarea" :disabled="cansave" />
          </el-form-item>
          <el-form-item label="需求详情" />
          <div>
            <template>
              <el-table ref="detailfrom" :data="form.demanddetailsData" :border="true">
                <!--                <el-table-column label="合同号" prop="contractcode" width="130">
                  <template slot-scope="scope">
                    <el-select v-model="scope.row.contractcode" placeholder="请选择合同" :disabled="cansave" @change="handleContractChanged(scope.row)">
                      <el-option v-for="item in contractlist" :label="item.hth" :value="item.hth" />
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column label="专柜编号" prop="deptcode" width="130">
                  <template slot-scope="scope">
                    <el-input v-model="scope.row.deptcode" autocomplete="off" size="small" :disabled="true" />
                  </template>
                </el-table-column>
                <el-table-column label="专柜名称" prop="deptname" width="150">
                  <template slot-scope="scope">
                    <el-input v-model="scope.row.deptname" autocomplete="off" size="small" :disabled="true" />
                  </template>
                </el-table-column>-->
                <el-table-column key="floor" label="楼层" prop="floor" width="100">
                  <template slot-scope="scope" width="100">
                    <el-select v-model="scope.row.floor" placeholder="请选择楼层" :disabled="cansave" @change="handleFloorChanged(scope.row)">
                      <el-option v-for="item in floors" :label="item.code" :value="item.name" />
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column key="adname" label="广告名称" prop="adname" width="150">
                  <template slot-scope="scope">
                    <el-select v-model="scope.row.adname" placeholder="请选择位置" :disabled="cansave" @change="handleAdnameChanged(scope.row)">
                      <el-option v-for="item in adnames" :label="item.adname" :value="item.adname" />
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column key="timeunit" label="时间单位" prop="timeunit" width="100">
                  <template slot-scope="scope">
                    <el-select v-model="scope.row.timeunit" placeholder="请选择时间单位" :disabled="cansave" @change="handleTimeunitsChanged(scope.row)">
                      <el-option v-for="item in timeunits" :label="item.timeunit" :value="item.timeunit" />
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column v-if="form.adtype==='LED'" key="duration" label="视频时长" prop="duration" width="100">
                  <template slot-scope="scope">
                    <el-select v-model="scope.row.duration" placeholder="请选择视频时长" :disabled="cansave" @change="handleDurationChanged(scope.row)">
                      <el-option v-for="item in durations" :label="item.duration" :value="item.duration" />
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column v-if="form.adtype==='LED'" key="countday" label="频次" prop="countday" width="100">
                  <template slot-scope="scope">
                    <el-select v-model="scope.row.countday" placeholder="请选择频次" :disabled="cansave">
                      <el-option v-for="item in countdays" :label="item.label" :value="item.value" />
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column key="adrent" label="广告租金" prop="adrent" width="100">
                  <template slot-scope="scope">
                    <el-input v-model.number="scope.row.adrent" :disabled="true" />
                  </template>
                </el-table-column>
                <el-table-column key="days" label="投放周期" prop="days" width="125">
                  <template slot-scope="scope">
                    <el-input-number v-model.number="scope.row.days" style="width: 100px" :min="1" :disabled="cansave" @change="handleAddaysChanged(scope.row)" />
                  </template>
                </el-table-column>
                <el-table-column key="ckmoney" label="参考金额" prop="ckmoney" width="120">
                  <template slot-scope="scope">
                    <el-input v-model.number="scope.row.ckmoney" autocomplete="off" size="small" :disabled="true" />
                  </template>
                </el-table-column>
                <el-table-column key="htmoney" label="合同金额" prop="htmoney" width="120">
                  <template slot-scope="scope">
                    <el-input v-model.number="scope.row.htmoney" placeholder="" :disabled="cansave" @change="handlemoneyChanged()" />
                  </template>
                </el-table-column>
                <el-table-column v-if="form.adtype!=='LED'" key="processcost" label="制作费" prop="processcost" width="100">
                  <template slot-scope="scope">
                    <el-input v-model.number="scope.row.processcost" :disabled="true" />
                  </template>
                </el-table-column>
                <el-table-column v-if="form.adtype!=='LED'" key="processcount" label="制作次数" prop="processcount" width="100">
                  <template slot-scope="scope">
                    <el-input v-model.number="scope.row.processcount" :disabled="cansave" @change="handleProcesscountChanged(scope.row)" />
                  </template>
                </el-table-column>
                <el-table-column v-if="form.adtype!=='LED'" key="totalmoney" label="合计金额" prop="totalmoney" width="120">
                  <template slot-scope="scope">
                    <el-input v-model.number="scope.row.totalmoney" placeholder="" :disabled="true" />
                  </template>
                </el-table-column>
                <el-table-column key="startDate" label="开始日期" prop="startDate" width="160">
                  <template slot-scope="scope">
                    <el-date-picker v-model="scope.row.startDate" style="width: 130px" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" :disabled="cansave" @change="handleStartDateChanged(scope.row)" />
                  </template>
                </el-table-column>
                <el-table-column key="endDate" label="截止日期" prop="endDate" width="160">
                  <template slot-scope="scope">
                    <el-date-picker v-model="scope.row.endDate" style="width: 130px" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" :disabled="cansave" />
                  </template>
                </el-table-column>
                <!--<el-table-column label="附加" prop="addition" width="120" key="addition">
                  <template slot-scope="scope">
                    <el-input v-model="scope.row.addition" placeholder="" :disabled="cansave" />
                  </template>
                </el-table-column> -->
                <el-table-column label="操作" width="100">
                  <template slot-scope="scope">
                    <el-button size="mini" type="danger" plain :disabled="cansave" @click="deldetails(scope.$index)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <el-button class="el-icon-circle-plus-outline" :disabled="cansave" @click="adddetails" />
            </template>
          </div>
          <el-row>
            <el-col :span="8">
              <el-form-item label="扣费合计" prop="summoney">
                <u>{{ form.summoney }}</u>元
                <!--                <el-input v-model.number="form.summoney" style="width: 200px" :disabled="true" />-->
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="参考合计" prop="benifmoney">
                <span>{{ sumck }}</span>元
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="优惠金额" prop="benifmoney">
                <span>{{ sumck - form.summoney }}</span>元
              </el-form-item>
            </el-col>
          </el-row>
        </div>
        <div class="ContractLinkBox" :hidden="form.ifcontract==='否'">
          <el-row>
            <el-col :span="8">
              <el-form-item label="联系人" prop="linkname" :rules="{required: form.ifcontract==='是'&&form.sealtype==='电子印章', message: '请填写联系人', trigger: 'blur' }">
                <el-input v-model="form.linkname" style="width: 200px" :disabled="cansave" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item
                label="联系电话"
                prop="linktel"
                :rules="[{required: form.ifcontract==='是'&&form.sealtype==='电子印章', message: '请填写联系电话', trigger: 'blur' },
                         {pattern: /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/,message: '请输入正确的手机号码'}]"
              >
                <el-input v-model="form.linktel" style="width: 200px" maxlength="11" :disabled="cansave" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="品牌名称" prop="brandname" :rules="{required: form.ifcontract==='是', message: '请填写品牌名称', trigger: 'blur' }">
                <el-input v-model="form.brandname" style="width: 200px" :disabled="cansave" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="签约时间" prop="signDate" :rules="{required: form.ifcontract==='是', message: '请选择签约时间', trigger: 'change' }">
                <el-date-picker v-model="form.signDate" width="170" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" :disabled="cansave" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item label="合同链接" prop="contractUrl">
            <!--            <input type="button" @click="filepathBrowser(form.contractpath)" value="选择路径" />-->
            <input id="filepath" type="file" webkitdirectory >
            <!--
            <el-button  @click="BrowseFolder">测试</el-button>-->
          </el-form-item>
          <el-row>
            <el-col>
              <el-form-item label="合同链接" prop="contractUrl" :hidden="form.contractUrl===''">
                <el-link type="primary" @click="openContract(form.contractUrl)">查看合同</el-link>
                <el-link type="primary" style="padding-left: 15px" @click="downloadContract">下载合同</el-link>
                <!-- <input type="button" @click="filepathBrowser(form.contractpath)" value="选择路径" />
--                <input type="file" id="filepath" hidden @change="filepathBrowser" webkitdirectory/>
                  <el-button @click="btnClick"></el-button>-->
              </el-form-item>
            </el-col>
          </el-row>

        </div>
        <div>
          <el-row>
            <el-col :span="8">
              <el-form-item label="合同附件" prop="contractUrl" :hidden="true">
                <el-link type="primary" @click="">上传附件</el-link>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="扣款单号" prop="deductioncode" :hidden="form.deductioncode===0">
                <span>{{ form.deductioncode }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="收入缴存单号" prop="paymentcode" :hidden="form.paymentcode===''">
                <span>{{ form.paymentcode }}</span>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
        <el-form-item>
          <el-button type="primary" :disabled="cansave" @click="onSave('contractform')">保存</el-button>
          <el-button type="primary" :disabled="cansubmit" @click="onSubmit()">发起流程</el-button>
          <el-button type="primary" :disabled="canmodify" @click="onModify()">修改</el-button>
          <el-button :disabled="disableflag" @click="onAbate('contractform')">作废</el-button>
        </el-form-item>
      </el-form>
    </u-page>
    <el-drawer
      title="厂商合同信息"
      :visible.sync="fcInfotable"
      direction="rtl"
      size="70%"
    >
      <div style="margin-top: 5px;padding-left: 10px">
        <el-row>
          <el-col :span="8">
            <el-input v-model="keyWord" placeholder="请输入内容" class="input-with-select" @input="keyWordChange()" />
          </el-col>
          <el-col :span="12">
            <div style="font-size:12px;padding-top: 7px">（可输入厂商编号、或厂商名称、或专柜编号、或专柜名称的部份文字进行筛选）</div>
          </el-col>
        </el-row>
      </div>
      <u-table
        :data="fcInfoData"
        :options="listOptions"
        :columns="fcInfocolumns"
      >
        <template v-slot:right>
          <el-table-column label="操作" align="center" fixed="right">
            <template slot-scope="{ row }">
              <el-button type="text" @click="getFirm(row)">选择</el-button>
            </template>
          </el-table-column>
        </template>
      </u-table>
    </el-drawer>
  </div>
</template>

<script>
export default {
  components: {
  },
  data() {
    return {
      durationflag: true,
      listOptions: {
        stripe: true
      },
      // 保存按钮激活
      cansave: false,
      // 提交按钮激活
      cansubmit: true,
      // 修改按钮激活
      canmodify: true,
      // 作废按钮
      disableflag: true,
      // 合同类型数组
      contractTypes: [{ id: '1', label: '公司承担', value: '公司承担' }, { id: '2', label: '厂商承担', value: '厂商承担' }, {
        id: '3',
        label: '第三方承担',
        value: '第三方承担'
      }],
      countdays: [{ value: -1, label: '不限' }],
      formname: '流水号',
      // 合同数据
      contractlist: [],
      // 楼层
      floors: [],
      // 广告名称
      adnames: [],
      // 视频时长
      durations: [],
      // 时间单位
      timeunits: [],
      // led类型
      ledtypes: [],
      // 总金额
      sum: 0,
      // 总参考金额
      sumck: 0,
      // 总制作金额
      sumpro: 0,
      deptinfo: {},
      api: this.$u.api.ContractApply,
      dataapi: this.$u.api.ContractFormdata,
      deptList: [],
      // 表单所有数据
      form: {
        code: 0,
        updateflag: false,
        typename: '广告申请单',
        statusstr: '',
        // 人员信息
        applicantnickname: '',
        applicantusername: '',
        applicantuserid: '',
        preparernickname: '',
        preparerusername: '',
        prepareruserid: '',
        applyTime: '',
        endTime: '',
        ifcontract: '',
        sequence: '',
        sealtype: '',
        usertype: '',
        adtype: '',
        dept: '',
        deptname: '',
        deptid: '',
        contracttype: '',
        paytype: '',
        firmcode: '',
        firmname: '',
        hth: '',
        zgid: '',
        zgname: '',
        summoney: 0,
        remarks: '',
        demanddetailsData: [],
        // 联系人资料
        linkname: '',
        linktel: '',
        brandname: '',
        signDate: '',
        contractUrl: '',
        contractid: '',
        deductioncode: 0,
        paymentcode: '',
        contractpath: ''
      },
      // 规则
      contractform: {
        ifcontract: [
          { required: true, message: '请选择是否生成合同', trigger: 'change' }
        ],
        adtype: [
          { required: true, message: '请选择广告类型', trigger: 'change' }
        ],
        deptid: [
          { required: true, message: '请选择部门', trigger: 'change' }
        ],
        contracttype: [
          { required: true, message: '请选择合同类型', trigger: 'change' }
        ],
        paytype: [
          { required: true, message: '请选择付款类型', trigger: 'change' }
        ],
        firmname: [
          { required: true, message: '请填写厂商名称', trigger: 'blur' }
        ],
        summoney: [
          { required: true, message: '请填写合计金额', trigger: 'blur' },
          { type: 'number', message: '金额必须填写数字' }
        ]
      },
      value: '',
      fcInfotable: false,
      // 厂商合同信息
      fcInfoData: [],
      searchfcInfoData: [],
      keyWord: '',
      searchWord: '',
      fcInfocolumns: [
        {
          prop: 'firmcode',
          label: '厂商编号'
        },
        {
          prop: 'firmname',
          label: '厂商名称',
          width: '220'
        },
        {
          prop: 'contractcode',
          label: '合同编号'
        },
        {
          prop: 'startdate',
          label: '开始日期',
          width: '150',
          render: (h, params) => {
            return h('el-tag', this.$u.timeFormat(new Date(params.row.startdate).getTime(), 'yyyy-mm-dd'))
          }
        },
        {
          prop: 'enddate',
          label: '结束日期',
          width: '150',
          render: (h, params) => {
            return h('el-tag', this.$u.timeFormat(new Date(params.row.enddate).getTime(), 'yyyy-mm-dd'))
          }
        },
        {
          prop: 'deptid',
          label: '专柜编号'
        },
        {
          prop: 'dept_name',
          label: '专柜名称'
        }
      ]
    }
  },
  created() { },
  mounted() {
    this.getDeptList()
    this.getFloors()
    this.getLedType()
    // 如果传了参数，则加载数据
    if (this.$route.query.formcode != null) {
      this.getLedFormdata(this.$route.query.formcode)
    } else {
      this.getApplicant()
    }
    document.querySelector('#filepath').addEventListener('change', e => {
      for (const entry of e.target.files) { console.log(entry.name, entry.webkitRelativePath) }
    })
  },
  methods: {
    btnClick() {
      const fileObj = document.getElementById('filepath')
      fileObj.click()
    },
    filepathBrowser() {
      const fileObject = document.getElementById('filepath')
      console.log('aaaa===>', fileObject.files[0])
    },
    // 加载申请人员
    getApplicant() {
      const self = this
      self.api.applicant().then(res => {
        self.form.applicantusername = res.data.username
        self.form.applicantnickname = res.data.usernickname
        self.form.applicantuserid = res.data.userid
        self.form.preparerusername = res.data.username
        self.form.preparernickname = res.data.usernickname
        self.form.prepareruserid = res.data.userid
        self.form.applyTime = res.data.nowtime
      })
    },
    // 加载部门
    getDeptList() {
      const self = this
      self.api.deptList().then(res => {
        // this.deptList = this.$u.tree(res.data)
        this.deptList = res.data
      })
    },
    // 加载楼层
    getFloors() {
      const self = this
      self.api.floors().then(res => {
        this.floors = res.data
      })
    },
    // 加载led类型
    getLedType() {
      const self = this
      self.api.ledTypes().then(res => {
        this.ledtypes = res.data
      })
    },
    // 获取厂商信息
    hdlfirmcode() {
      const self = this
      this.form.firmname = ''
      self.api.firmName(self.form).then(res => {
        this.form.firmname = res.data
      })
    },
    // 保存
    onSave(formName) {
      const self = this
      // 表单验证
      this.$refs[formName].validate((valid) => {
        if (valid) {
          // 子表单判断
          if (self.form.demanddetailsData.length === 0) {
            self.$message.error('保存失败！需求详情错误！')
            return
          }
          // eslint-disable-next-line no-unused-vars
          let s = 0
          self.form.demanddetailsData.forEach(item => {
            if (self.form.adtype === 'LED') {
              s += item.htmoney
            } else {
              s += item.totalmoney
            }
          })
          if (self.form.summoney === 0 || self.form.summoney !== s) {
            self.$message.error('保存失败！请检查金额是否正确！')
            return
          }
          // 通过验证进行提交动作
          self.api.save(self.form).then(res => {
            // 更新表单编号
            this.form.code = res.data
            // 将表单设置为只读
            this.cansave = true
            // 修改提交作废按钮变亮
            this.cansubmit = false
            this.canmodify = false
            this.disableflag = false
            // 通知信息
            self.$u.msg(res.msg)
          }).catch(() => {
            return
          })
        } else {
          return false
        }
      })
    },
    // 修改
    onModify() {
      this.cansave = false
      this.cansubmit = true
      this.canmodify = true
      this.form.updateflag = true
    },
    // 提交
    onSubmit() {
      const self = this
      // 通过验证进行提交动作
      self.api.submit(self.form).then(res => {
        // 通知信息
        self.$u.msg(res.msg)
        // 初始化数据
        // 刷新页面
        self.$router.go(0)
      }).catch(() => {
        return
      })
    },
    // 作废
    onAbate() {
      const self = this
      // 通过验证进行提交动作
      self.api.abate(self.form).then(res => {
        // 通知信息
        self.$u.msg(res.data)
        // 刷新页面
        self.$router.go(0)
      }).catch(() => {
        return
      })
    },
    // 编辑功能:监听组织变化
    handledeptChanged(value, label) {
      const self = this
      self.form.deptname = this.$refs['depts'].getCheckedNodes()[0].label
      self.form.deptid = this.$refs['depts'].getCheckedNodes()[0].value
    },
    // 处理合同类型改变事件
    handleContracttypeChanged(value) {
      if (value === '第三方承担') {
        this.form.paytype = '现金缴款'
      } else if (this.form.paytype === '') {
        this.form.paytype = '账扣'
      }
    },
    // 添加需求详情
    adddetails() {
      const self = this
      if (self.form.adtype === '') {
        self.$message.error('请选择广告类型！')
        return
      }
      if (self.form.adtype === 'LED') {
        self.form.demanddetailsData.push({
          floor: '',
          adname: '',
          timeunit: '',
          duration: '',
          adrent: 0,
          days: '',
          ckmoney: 0,
          htmoney: '',
          startDate: '',
          endDate: ''
        })
      } else {
        self.form.demanddetailsData.push({
          floor: '',
          adname: '',
          timeunit: '',
          adrent: 0,
          days: '',
          ckmoney: 0,
          processcost: 0,
          processcount: '',
          htmoney: '',
          totalmoney: '',
          startDate: '',
          endDate: ''
        })
      }
    },
    // 删除需求详情
    deldetails(index) {
      const self = this
      self.$confirm('确认删除吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        // 点击确定的操作
        self.form.demanddetailsData.splice(index, 1)
        // 重新计算合计金额
        /* self.sum = 0
        self.sumck = 0
        self.form.demanddetailsData.forEach(item => {
          const m = item.htmoney - 0
          const c = item.ckmoney - 0
          self.sum += m
          self.sumck += c
        })
        self.form.summoney = self.sum*/
        this.handlemoneyChanged()
      }).catch(() => {
        return
      })
    },
    handleFloorChanged(row) {
      const self = this
      row.adtype = self.form.adtype
      // 初始化
      row.adname = ''
      row.duration = ''
      row.timeunit = ''
      row.adrent = 0
      row.ckmoney = 0
      row.htmoney = ''
      row.totalmoney = ''
      row.startDate = ''
      row.endDate = ''
      this.handlemoneyChanged()
      self.api.adnames(row).then(res => {
        self.adnames = res.data
      })
    },
    handleAdnameChanged(row) {
      const self = this
      row.adtype = self.form.adtype
      row.duration = ''
      row.timeunit = ''
      row.adrent = 0
      row.ckmoney = 0
      row.htmoney = ''
      row.totalmoney = ''
      row.startDate = ''
      row.endDate = ''
      this.handlemoneyChanged()
      self.api.addurations(row).then(res => {
        self.durations = res.data
      })
      self.api.adtimeunits(row).then(res => {
        self.timeunits = res.data
      })
    },
    // 时间单位选择
    handleTimeunitsChanged(row) {
      const self = this
      row.adrent = 0
      row.processcost = 0
      row.ckmoney = 0
      row.htmoney = ''
      row.totalmoney = ''
      row.adtype = self.form.adtype
      this.handlemoneyChanged()
      if (self.form.adtype !== 'LED') {
        row.duration = '0'
        self.api.adrent(row).then(res => {
          row.adrent = res.data.adrent
          row.processcost = res.data.processcost
          row.ckmoney = row.adrent * row.days
        })
      }
    },
    // 视频时长选择
    handleDurationChanged(row) {
      const self = this
      row.adtype = self.form.adtype
      row.adrent = 0
      row.ckmoney = 0
      row.htmoney = ''
      row.totalmoney = ''
      this.handlemoneyChanged()
      self.api.adrent(row).then(res => {
        row.adrent = res.data.adrent
        row.processcost = res.data.processcost
        if (self.form.adtype === 'LED') {
          row.ckmoney = row.adrent * row.days
          this.handlemoneyChanged()
        }
      })
    },
    handleAddaysChanged(row) {
      const self = this
      if (row.adrent !== '') {
        row.ckmoney = row.adrent * row.days
        this.handlemoneyChanged()
      }
      if (row.startDate !== '') {
        self.api.enddate(row).then(res => {
          row.endDate = res.data
        })
      }
    },
    handleProcesscountChanged(row) {
      row.ckmoney = row.adrent * row.days
      this.handlemoneyChanged()
    },
    //  输入合同号获取
    hdldeptinfo(row) {
      const self = this
      row.firmcode = this.form.firmcode
      self.api.deptInfo(row).then(res => {
        row.deptcode = res.data.deptid
        row.deptname = res.data.dept_name
      })
    },
    // 元素改变
    handleElementChanged(row) {
      const self = this
      if (row.days !== '' && row.countday !== '' && row.countmoney !== '') {
        row.ckmoney = row.days * row.countday * row.countmoney
        row.htmoney = row.ckmoney
        // 算总金额
        self.sum = 0
        self.form.demanddetailsData.forEach(item => {
          const m = item.htmoney - 0
          self.sum += m
        })
        self.form.summoney = self.sum
      }
    },
    // 金额改变
    handlemoneyChanged() {
      const self = this
      self.sum = 0
      self.sumck = 0
      self.form.demanddetailsData.forEach(item => {
        item.totalmoney = item.htmoney + item.processcount * item.processcost
        let m = 0
        let c = 0
        if (self.form.adtype === 'LED') {
          m = item.htmoney - 0
          c = item.ckmoney - 0
        } else {
          m = item.totalmoney - 0
          c = item.ckmoney + item.processcount * item.processcost
        }
        self.sum += m
        self.sumck += c
      })
      self.form.summoney = self.sum
    },
    // 选择开始日期
    handleStartDateChanged(row) {
      const self = this
      self.api.enddate(row).then(res => {
        row.endDate = res.data
      })
    },
    // 打开厂商资料弹窗
    handleFCInfos() {
      const self = this
      if (self.form.deptname === '') {
        self.$message.error('请先选择扣款部门！')
        return
      }
      self.api.fcInfos(self.form).then(res => {
        this.fcInfoData = res.data
        this.searchfcInfoData = res.data
      })
      self.fcInfotable = true
    },
    // 输入关键字
    keyWordChange() {
      const self = this
      // 表格用原表格的数据 即 用于搜索的总数据
      // self.fcInfoData = self.searchfcInfoData
      const _search = self.keyWord
      const newListData = [] // 用于存放搜索出来数据的新数组
      if (self.keyWord !== '') {
        // filter 过滤数组
        this.searchfcInfoData.filter((item) => {
          // newListData中 没有查询的内容，就添加到newListData中
          if (
            item.firmname.indexOf(_search) !== -1 ||
            item.firmcode.indexOf(_search) !== -1 ||
            item.deptid.indexOf(_search) !== -1 ||
            item.dept_name.indexOf(_search) !== -1
          ) {
            newListData.push(item)
          }
        })
        this.fcInfoData = newListData
      } else {
        self.fcInfoData = self.searchfcInfoData
      }
    },
    //  获取表单数据并初始化参数
    getLedFormdata(formcode) {
      const self = this
      self.form.code = formcode
      self.form.typename = '广告申请单'
      self.dataapi.ledFormData(self.form).then(res => {
        const maindata = res.data
        const { leddata } = maindata
        self.form.applicantusername = maindata.applicantusername
        self.form.applicantnickname = maindata.applicantnickname
        self.form.applicantuserid = maindata.applicantuserId
        self.form.preparerusername = maindata.preparerusername
        self.form.preparernickname = maindata.preparernickname
        self.form.applyTime = maindata.starttime
        self.form.endTime = maindata.endTime
        if (maindata.ifcontract) {
          self.form.ifcontract = '是'
          self.form.sequence = maindata.sequence
          self.form.sealtype = maindata.sealtype
        } else {
          self.form.ifcontract = '否'
        }
        if (maindata.contractUrl !== '') {
          self.form.contractUrl = maindata.contractUrl
        }
        if (leddata.deductioncode !== 0) {
          self.form.deductioncode = leddata.deductioncode
        }
        if (leddata.paymentcode !== '') {
          self.form.paymentcode = leddata.paymentcode
        }
        self.form.contractid = maindata.contractId
        self.form.usertype = maindata.usertype
        self.form.adtype = leddata.adtype
        self.form.deptname = leddata.deptname
        self.form.deptid = leddata.deptid
        self.form.contracttype = leddata.contracttype
        self.form.paytype = leddata.paytype
        self.form.firmcode = leddata.firmcode
        self.form.firmname = leddata.firmname
        self.form.zgid = leddata.zgid
        self.form.zgname = leddata.zgname
        self.form.hth = leddata.hth
        self.form.summoney = leddata.summoney
        self.form.remarks = leddata.remarks
        self.form.linkname = leddata.linkname
        self.form.linktel = leddata.linktel
        self.form.brandname = leddata.brandname
        self.form.signDate = leddata.signDate
        self.form.dept = leddata.dept
        // 状态判断
        if (maindata.status === 0) {
          // 将表单设置为只读
          this.cansave = true
          this.cansubmit = false
          this.canmodify = false
          this.disableflag = false
          self.form.statusstr = '未提交'
        } else if (maindata.status === 1) {
          this.cansave = true
          this.cansubmit = true
          this.canmodify = true
          this.disableflag = false
          self.form.statusstr = '流转中'
        } else if (maindata.status === 2) {
          this.cansave = true
          this.cansubmit = true
          this.canmodify = true
          this.disableflag = true
          self.form.statusstr = '签核完成'
        } else if (maindata.status === 3) {
          // 将表单设置为只读
          this.cansave = true
          this.cansubmit = true
          this.canmodify = false
          this.disableflag = false
          self.form.statusstr = '驳回'
        } else if (maindata.status === 4) {
          // 将表单设置为只读
          this.cansave = true
          this.cansubmit = true
          this.canmodify = false
          this.disableflag = false
          self.form.statusstr = '撤销流程'
        } else if (maindata.status === 5) {
          this.cansave = true
          this.canmodify = true
          this.cansubmit = true
          this.disableflag = true
          self.form.statusstr = '作废'
        }
        self.form.demanddetailsData = leddata.demanddetailsData
        this.handlemoneyChanged()
      })
    },
    // 打开合同浏览链接
    openContract(url) {
      window.open(url)
    },
    // 下载合同文档
    downloadContract() {
      const self = this
      /* const fu = document.getElementById('file')
      if (fu == null) return
      this.form.contractpath = fu.files[0].path
      console.log(this.form.contractpath)*/
      self.dataapi.downloadcontract(self.form).then(res => {
        // 通知信息
        self.$u.msg(res.msg)
      })
    },
    // 厂商弹窗选择功能
    getFirm(row) {
      const self = this
      self.form.firmcode = row.firmcode
      self.form.firmname = row.firmname
      self.form.hth = row.contractcode
      self.form.zgid = row.deptid
      self.form.zgname = row.dept_name
      // self.form.hth=
      self.fcInfotable = false
      self.api.contractlist(self.form).then(res => {
        this.contractlist = res.data
      })
    }
  }
}
</script>

<style scoped>
.contractCheckBox {
  padding-bottom: 5px;
  border-bottom: 1px solid #c0c4cc;
}
.contractCheckBox .el-form-item{
  margin-bottom:3px;
}
.contractCheckBox .el-form-item--small .el-form-item{
  margin-bottom:3px;
}
.contractDetailBox{
  padding-top: 5px;
  border-bottom: 1px solid #c0c4cc;
}
.ContractLinkBox{
  padding-top: 10px;
}

</style>
